<template>
  <div class="contain">
    <div class="text">
      <p>
        原密码 <input type="password" name="0" ref="pwd0">
      </p>

      <p>
        新密码 <input type="password" name="1" ref="pwd1">
      </p>

      <p>
        新密码 <input type="password" name="2" ref="pwd2">
      </p>
    </div>

    <div class="button">
      <button class="left-button" @click="handlerPwd">提交</button>
      <button class="right-button" @click="init">重置</button>
    </div>

  </div>
</template>

<script>
import loginService from "@/services/loginService";

export default {
  name: "ChangePwd",
  methods: {
    init() {
      this.$refs.pwd0.value = "";
      this.$refs.pwd1.value = "";
      this.$refs.pwd2.value = "";
    },
    handlerPwd() {
      var pwd0 = this.$refs.pwd0.value;
      var pwd1 = this.$refs.pwd1.value;
      var pwd2 = this.$refs.pwd2.value;
      //验证原密码
      var pwd = sessionStorage.getItem('password');
      if (pwd !== pwd0) {
        alert("原密码错误");
        return;
      }
      //验证新密码
      if (pwd1 !== pwd2) {
        alert("密码不同");
        return;
      }
      var result = loginService.updatePwd(sessionStorage.getItem('username'),pwd1);
      // this.$emit('updatePwd', pwd1);
      //更新session
      sessionStorage.setItem('password', pwd1);
      this.init();
    }
  }
}
</script>

<style scoped>
.contain {
  width: 100%;
  font-size: 15px;
  font-family: SimSun;
}

.button {
  margin-top: 50px;
  margin-left: 20px;
  width: 200px;
}

.left-button,
.right-button {
  width: 80px;
}

.left-button {
  float: left;
}

.right-button {
  float: right;
}

</style>